<script setup>
import { ref } from 'vue'
import {listInbox} from "../../../api/user/user.js";
import router from "../../../router/index.js";
import SignInOne from "../../course/Mangement/Task/One/SignInOne.vue";
import {getSignIn} from "../../../api/course/course.js";
const activeIndex = ref('3')

// 总数
const total=ref(10);
// 收件箱对象
const inbox=ref([]);
// 查询条件
const condition=ref({
  type:null,
  pageNum:1,
  pageSize:6
});

// 是否签到
const isSignIn=ref();
// 签到信息
const signIn=ref();

// 查询当前用户的收件箱对象
const handleListInbox=async ()=>{

  await listInbox(condition.value).then(res=>{
    console.log(res.data)
    total.value=res.data.total;
    inbox.value=res.data.data;
    console.log(inbox.value);
  })
}

// 跳转到详情页面
const handleGoOne=(type,oneId)=>{
  if (type===0){
    router.push("/assignment/"+oneId)
  }else if (type===1){
    router.push("/exam/"+oneId)
  }else if (type===2){
    handleChooseTask(type,oneId);
  }
}
// 选择任务
const handleChooseTask=(type,oneId)=>{
    if (type === 0) {
      console.log("签到");
      handleGetSignIn(oneId);
      isSignIn.value=true;
    } else if (type === 1) {
      router.push("/classpracticeone/"+oneId);
    } else if (type === 2) {
      router.push("/questionnaireone/"+oneId);
    } else if (type === 3) {
      router.push("/topicdiscussone/"+oneId);
    }
}
// 获取签到信息
const handleGetSignIn=async (taskId)=>{
  await getSignIn(taskId).then((res)=>{
    signIn.value=res.data;
    console.log(signIn.value);
  })
}

// 关闭签到页面
const handleCloseSignIn=()=>{
  isSignIn.value=false;
}

// 切换导航栏
const handleChangeActiveIndex=(index)=>{
  console.log(index)
  activeIndex.value=index;
  if(activeIndex.value==3){condition.value.type=null}
  else condition.value.type=activeIndex.value;
  condition.value.pageNum=1;
  handleListInbox();
}

handleListInbox();
</script>

<template>
  <!--  导航栏-->

  <el-menu
      :default-active="activeIndex"
      class="el-menu-demo"
      mode="horizontal"
      style="margin-bottom: 10px;"
      @select="handleChangeActiveIndex"
  >
    <el-menu-item index="3"><span style="font-size: 15px">全部类型</span></el-menu-item>
    <el-menu-item index="0"><span style="font-size: 15px">作业</span></el-menu-item>
    <el-menu-item index="1"><span style="font-size: 15px">考试</span></el-menu-item>
    <el-menu-item index="2"><span style="font-size: 15px">任务</span></el-menu-item>
  </el-menu>
<div style="height: 500px">
  <el-card v-for="item in inbox" :key="item" style="margin-bottom: 10px;height: 70px;" shadow="hover" @click="handleGoOne(item.type,item.oneId)">
<!--    图片加为文字-->
    <div style="display: flex;justify-content: space-between">
    <span>{{item.content}}</span>
    <span>创建时间 {{new Date(item.createTime).toLocaleString('zh-CN', { month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric', hour12: true }).replace('上午', 'AM').replace('下午', 'PM').replace('AM', '上午').replace('PM', '下午') }}</span>
    </div>
  </el-card>
  </div>
  <el-pagination
      v-model:current-page="condition.pageNum"
      :page-size="condition.pageSize"
      :disabled="false"
      :background="true"
      layout="total, prev, pager, next"
      :total="total"
      @change="handleListInbox"
      style="display: flex;float: right;"
  />
  <SignInOne @close="handleCloseSignIn" v-model="isSignIn" :signIn="signIn"></SignInOne>
</template>

<style scoped lang="less">

</style>